const composedStyle = breakpoints(
    css(
        compose(
            borders,
            display,
            flexbox,
            palette,
            positions,
            shadows,
            sizing,
            spacing,
            typography
        )
    )
)

const Box = styled.div`
    ${composedStyle}
`

// use component
const Compoennt = () => (
    <Box sm={{ width: 500, css: { height: 800 } }}>Hello World!</Box>
)

// Property 'css' is missing, css prop is a must
const Compoennt = () => (
    <Box sm={{ width: 500, css: { height: 800 } }}>Hello World!</Box>
)

// I just added height prop, breakpoints function type doesn't allow 
// adding props as args of styled functions i.e. borders, display, flexbox, etc.
const Compoennt = () => (
    <Box height={800} sm={{ width: 500, css: { height: 800 } }}>
        Hello World!
    </Box>
)